<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Basic DataGrid - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="css/css/easyui.css">
    <link rel="stylesheet" type="text/css" href="css/css/icon.css">
    <link rel="stylesheet" type="text/css" href="css/css/demo.css">
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>

<script type="text/javascript"charset="utf-8" src="http://cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<script type="text/javascript" charset="utf8" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<style type="text/css" title="currentStyle">
 @import "http://cdn.datatables.net/1.10.0/css/jquery.dataTables.css";
</style>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
	 
    $('#tableId').dataTable( {
    	 serverSide: true,
    	    ajax: {
    	        url: './tradeBook',
    	        type: 'POST'
    	    }
    });  
} );
</script>
</head>
<body>
    
    <div style="margin:20px 0;"></div>
    
    <table id="tableId" cellpadding="0" cellspacing="0" border="0"  style="width:1300px;height:250px;">
          
        <thead>
            <tr>
				<th width="10%">Item ID</th>
				<th width="10%">Condition Type</th>
				<th width="10%">Instrument Name</th>
				<th width="10%">Symbol</th>
				<th width="10%">Expiry/Series</th>
				<th width="10%">Total Quantity</th>
				<th width="10%">Total Lots</th>
				<th width="10%">Total Weight</th>
				<th width="10%">Price</th>
				<th width="10%">Product Type</th>
				<th width="10%">Trigger Price</th>
				<th width="10%">TimeStamp</th>
				<th width="10%">Order Type</th>
				<th width="10%">USER ID</th>
				
            </tr>
        </thead>
    </table>
 
</body>
</html>